<template>
	<view class="voteq_box">
		<view class="top_navbar" v-if="info.banner">
			<image class="banner_img" :src="info.img_url+info.banner"></image>
		</view>
		<view v-if="info.id">
			<view class="vote_info">
				<view class="vote_titled">
					{{info.title}}
				</view>
				<view class="vote_desc">
					<rich-text style="color: #383838;" :nodes="info.desc"></rich-text>
				</view>
			</view>
			<block v-if="info.is_choose==0">
				<view class="answer_box" v-for="(item,index) in question" :key="item.id" v-if="item.isShow==1">
					<view class="answer_title" v-if="info.type==1">
						<view class="request_star">{{item.is_required==1?'*':''}}</view>
						{{item.title}}
						<!-- <block v-if="item.num>1">(最多选择{{item.num}}项)</block> -->
					</view>
					<!-- 没有子问题 -->
					<view class="answer_cell" v-if="item.is_opt==0">
						<block v-if="item.type==1">
							<view v-for="(itema,indexa) in item.option" :key="itema.id">
								<view class="answer"
									:style="info.type==1?'width:'+100/item.show_type+'%;':'display: block;width:'+100/item.show_type+'%;'"
									@click="chaeckRadio(index,indexa,itema.is_show)">
									<view style="display: flex;align-items: center;" v-if="item.content_type==1">
										<image class="radio_img"
											src="https://pic.motortime.com/static/fuji_uni/radio_on.png"
											v-if="itema.is_check==1">
										</image>
										<image class="radio_img"
											src="https://pic.motortime.com/static/fuji_uni/radio.png" v-else></image>
										<view style="flex: 1;">{{itema.content}}</view>
									</view>
									<view style="display: flex;align-items: center;" v-else>
										<image class="radio_img"
											src="https://pic.motortime.com/static/fuji_uni/radio_on.png"
											v-if="itema.is_check==1">
										</image>
										<image class="radio_img"
											src="https://pic.motortime.com/static/fuji_uni/radio.png" v-else></image>
										<image class="choose_img" mode="widthFix" :src="info.img_url+itema.content"
											v-if="item.content_type==2"></image>
										<video class="choose_img" :src="info.img_url+itema.content"
											v-if="item.content_type==3"></video>
									</view>
								</view>
								<view v-if="item.content_type==2" class="checkImgText"
									@click="checkBigImg(itema.content)">查看大图</view>
								<view v-if="itema.is_check==1&&itema.is_show==1" @click="changeTextarea(index)"
									style="display: flex;" class="text_input_box">
									<textarea class="text_input" style="height: 120rpx;" v-model="itema.text"
										:data-indexa="indexa" @input="bindChildTextArea" placeholder="请输入...(1-500字）"
										maxlength="500" />
								</view>
							</view>
							<!-- <view v-for="(itema,indexa) in item.option" :key="itema.id"
								v-if="itema.is_check==1&&itema.is_show==1" @click="changeTextarea(index)"
								style="display: flex;">
								<textarea class="text_input" style="height: 120rpx;" v-model="itema.text"
									:data-indexa="indexa" @input="bindChildTextArea" placeholder="请输入...(1-500字）"
									maxlength="500" />
							</view> -->
						</block>
						<block v-if="item.type==2">
							<view v-for="(itema,indexa) in item.option" :key="itema.id">
								<view class="answer"
									:style="info.type==1?'width:'+100/item.show_type+'%;':'display: block;width:'+100/item.show_type+'%;'"
									@click="chaeckCheckbox(index,indexa,item.num,itema.is_show)">
									<view style="display: flex;align-items: center;" v-if="item.content_type==1">
										<image class="radio_img"
											src="https://pic.motortime.com/static/fuji_uni/checkbox_on.png"
											v-if="itema.is_check==1">
										</image>
										<image class="radio_img"
											src="https://pic.motortime.com/static/fuji_uni/checkbox.png" v-else></image>
										<view style="flex: 1;">{{itema.content}}</view>
									</view>
									<view style="display: flex;align-items: center;" v-else>
										<image class="radio_img"
											src="https://pic.motortime.com/static/fuji_uni/checkbox_on.png"
											v-if="itema.is_check==1">
										</image>
										<image class="radio_img"
											src="https://pic.motortime.com/static/fuji_uni/checkbox.png" v-else></image>
										<image class="choose_img" mode="widthFix" :src="info.img_url+itema.content"
											v-if="item.content_type==2"></image>
										<video class="choose_img" :src="info.img_url+itema.content"
											v-if="item.content_type==3"></video>
									</view>
								</view>
								<view v-if="item.content_type==2" class="checkImgText"
									@click="checkBigImg(itema.content)">查看大图</view>
								<view v-if="itema.is_check==1&&itema.is_show==1" @click="changeTextarea(index)"
									style="display: flex;" class="text_input_box">
									<textarea class="text_input" style="height: 120rpx;" v-model="itema.text"
										:data-indexa="indexa" @input="bindChildTextArea" placeholder="请输入...(1-500字）"
										maxlength="500" />
								</view>
							</view>
							<!-- <view v-for="(itema,indexa) in item.option" :key="itema.id"
								v-if="itema.is_check==1&&itema.is_show==1" @click="changeTextarea(index)"
								style="display: flex;">
								<textarea class="text_input" style="height: 120rpx;" v-model="itema.text"
									:data-indexa="indexa" @input="bindChildTextArea" placeholder="请输入...(1-500字）"
									maxlength="500" />
							</view> -->
						</block>
						<view style="display: flex;margin-top: 30rpx;" v-if="item.type==3">
							<textarea class="text_input" style="height: 120rpx;" v-model="item.text" :data-index="index"
								@input="bindTextArea" placeholder="请输入...(1-500字）" maxlength="500" />
						</view>
					</view>
					<!-- 有子问题 -->
					<view class="answer_cell" v-else>
						<block v-if="item.type==1">
							<block v-for="(itema,indexa) in item.option" :key="itema.id">
								<view class="answer_title">{{itema.content}}</view>
								<view class="answer_cell mb-15">
									<view v-for="(itemo,indexo) in itema.opt" :key="itema.id" class="answer"
										:style="info.type==1?'width:'+100/item.show_type+'%;':'display: block;width:'+100/item.show_type+'%;'"
										@click="chaeckChildRadio(index,indexa,indexo)">
										<view style="display: flex;align-items: center;">
											<image class="radio_img"
												src="https://pic.motortime.com/static/fuji_uni/radio_on.png"
												v-if="itemo.is_check==1">
											</image>
											<image class="radio_img"
												src="https://pic.motortime.com/static/fuji_uni/radio.png" v-else>
											</image>
											<view style="flex: 1;">{{itemo.content}}</view>
										</view>
									</view>
								</view>
							</block>
						</block>
					</view>
				</view>
				<view class="answer_box">
					<view @click="postSurvey" class="group_public_btn_block">{{info.button?info.button:'提交'}}</view>
				</view>
				<!-- <view class="answer_box text-c" style="display: flex;justify-content: center;">
					<view class="vote_btn" @click="postSurvey">{{info.button?info.button:'提交'}}</view>
				</view> -->
			</block>
			<block v-if="info.is_choose==1">
				<view class="answer_box" v-for="(item,index) in question" :key="item.id">
					<view class="answer_title">{{item.title}}</view>
					<view class="answer_cell" v-if="item.is_opt==0">
						<view class="display_flex mt-15" v-for="(itema,indexa) in item.option" :key="itema.id">
							<block v-if="item.type==1||item.type==2">
								<block v-if="item.type==1">
									<image class="radio_img"
										src="https://pic.motortime.com/static/fuji_uni/radio_on.png"
										v-if="itema.is_check==1">
									</image>
									<image class="radio_img" src="https://pic.motortime.com/static/fuji_uni/radio.png"
										v-else></image>
								</block>
								<block v-if="item.type==2">
									<image class="radio_img"
										src="https://pic.motortime.com/static/fuji_uni/checkbox_on.png"
										v-if="itema.is_check==1">
									</image>
									<image class="radio_img"
										src="https://pic.motortime.com/static/fuji_uni/checkbox.png" v-else></image>
								</block>
								<view v-if="item.content_type==1" class="myanswer_title">{{itema.content}}</view>
								<view class="myanswer_title" v-if="item.content_type==2">
									<image class="choose_img_mini" :src="info.img_url+itema.content" mode="widthFix"
										@click="checkBigImg(itema.content)"></image>
								</view>
								<view class="myanswer_title" v-if="item.content_type==3">
									<video class="choose_img_mini" :src="info.img_url+itema.content"></video>
								</view>
								<view class="display_flex" style="flex: 1;">
									<view class="display_flex" style="width:85%">
										<view class="progress" :style="'width:'+itema.percentaged+'%;'">
											<span class="f-10">{{itema.percentage}}%</span>
										</view>
									</view>
								</view>
							</block>
							<textarea v-if="item.type==3" disabled="true" class="text_input" style="margin-top: 0px;"
								v-model="item.option[0].text" placeholder="问题反馈" />
							<!-- <view class="progress" :style="'width:'+itema.percentage+ '%;'">
								<span class="ml-15">{{itema.content}}</span>
							</view> -->
						</view>
						<view class="display_flex mt-15" v-for="(itema,indexa) in item.option" :key="itema.id"
							v-if="itema.is_check==1&&itema.is_show==1">
							<textarea disabled="true" class="text_input" style="height: 120rpx;" v-model="itema.text" />
						</view>
					</view>
					<view class="answer_cell" v-if="item.is_opt==1">
						<view class="mt-15" v-for="(itema,indexa) in item.option" :key="itema.id">
							<view class="answer_title">{{itema.content}}</view>
							<view class="display_flex mt-15" v-for="(itemo,indexo) in itema.opt" :key="itemo.id">
								<image class="radio_img" src="https://pic.motortime.com/static/fuji_uni/radio_on.png"
									v-if="itemo.is_check==1">
								</image>
								<image class="radio_img" src="https://pic.motortime.com/static/fuji_uni/radio.png"
									v-else></image>
								<view class="myanswer_title">{{itemo.content}}</view>
								<view class="display_flex" style="flex: 1;">
									<view class="display_flex" style="width:85%">
										<view class="progress" :style="'width:'+itemo.percentaged+'%;'">
											<span class="f-10">{{itemo.percentage}}%</span>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
	import {
		getSurvey,
		postSurvey
	} from '@/api/motortime.js';
	let app = getApp()
	export default {
		data() {
			return {
				statusBarHeight: 20,
				pageTop: 72,
				info: '',
				question: [],
				ques: [],
				count: 1,
				question_index: '',
				huodong_join_id: 0,
				surveyed_status: '',
				channel: ''
			};
		},
		onLoad(options) {
			this.id = options.scene
			this.huodong_join_id = options.huodong_join_id ? options.huodong_join_id : 0
			this.huodong_id = options.huodong_id ? options.huodong_id : 0
			this.channel = options.channel ? options.channel : 0
			this.surveyed_status = options.surveyed_status ? options.surveyed_status : 0

			if (uni.getStorageSync('access_token')) {
				this.getSurvey()
			}
		},
		onShow() {
			var that = this
			uni.getSystemInfo({
				success: function(res) {
					that.statusBarHeight = res.statusBarHeight
					that.pageTop = res.statusBarHeight + 52
				}
			})
			if (!uni.getStorageSync('access_token')) {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			}
			if (uni.getStorageSync('onload')) {
				setTimeout(function() {
					that.getSurvey()
				}, 100)
				uni.removeStorage({
					key: 'onload'
				})
			}
		},
		methods: {
			getSurvey() {
				getSurvey(this.id).then(res => {
					if (res.state == 1) {
						this.info = res.data
						if (res.data.is_choose == 1 && res.data.result_status == 0) {
							if (this.huodong_join_id > 0) {
								uni.redirectTo({
									url: '/pages/group/groupactiveaudit?huodong_id=' + this.huodong_id +
										'&channel=' + this
										.channel + '&huodong_join_id=' + this.huodong_join_id +
										'&is_update=0'
								})
							} else {
								uni.redirectTo({
									url: '/pages/questionnaireok/questionnaireok?scene=' + this.id,
								})
							}
						} else {
							var question = res.data.question
							for (var i = 0; i < question.length; i++) {
								question[i].count = 1
								question[i].showTextarea = false
								question[i].textarea = ''
								question[i].isShow = 1
								var option = question[i].option
								if (question[i].is_opt == 0) {
									for (var j = 0; j < option.length; j++) {
										option[j].percentaged = parseFloat(option[j].percentage + 15)
									}
								} else if (question[i].is_opt == 1) {
									for (var j = 0; j < option.length; j++) {
										var opt = option[j].opt
										for (var k = 0; k < opt.length; k++) {
											opt[k].percentaged = parseFloat(opt[k].percentage + 15)
										}

									}
								}
							}
							const idMap = {};
							question.forEach((item, index) => {
								idMap[item.id] = index;
							});
							// 遍历数组A
							question.forEach((item, index) => {
								// 初始化isStop为0
								let isStop = 0;

								// 遍历item的b数组
								(item.option || []).forEach(bItem => {
									// 遍历bItem的c数组
									(bItem.relation || []).forEach(cId => {
										// 检查cId是否在数组A的其他项的id中
										if (idMap.hasOwnProperty(cId) && idMap[cId] !==
											index) {
											isStop = 1;
											return; // 如果已经找到匹配，则无需继续检查
										}
									});
								});

								// 设置isStop属性
								question[index].isStop = isStop;
							});
							this.question = question
							this.question_index = ''
							uni.setNavigationBarTitle({
								title: res.data.top ? res.data.top : '问卷',
							})
							var params = {
								event_code: res.data.top ? res.data.top : '问卷',
								event_id: this.id,
								title: this.info.title ? this.info.title : '问卷',
								value: '',
								path: 'pages/questionnaire/questionnaire',
								user_id: uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo')
									.user_id : 0,
							}
							app.BurialPoint(params)
						}

					}
				})
			},
			chaeckRadio(index, indexa, type) {
				var option = this.question[index].option
				this.question[index].showTextarea = type == 1 ? true : false
				if (this.question[index].isStop == 1) {
					for (var i = 0; i < option.length; i++) {
						if (i == indexa) {
							this.question[index].option[i].is_check = 1
							var relation = this.question[index].option[i].relation
							var question = this.question
							if (relation.length > 0) {
								question.forEach(item => {
									if (relation.includes(item.id)) {
										item.isShow = 2
									} else {
										item.isShow = 1
									}
								});
							}
							this.question = question
						} else {
							this.question[index].option[i].is_check = 0
						}
					}
				} else {
					for (var i = 0; i < option.length; i++) {
						if (i == indexa) {
							this.question[index].option[i].is_check = this.question[index].option[indexa].is_check == 1 ?
								0 : 1
						} else {
							this.question[index].option[i].is_check = 0
						}
					}
				}
				this.question_index = ''
				var params = {
					event_code: '问卷',
					event_id: this.question[index].id,
					title: this.question[index].title,
					value: this.question[index].option[indexa].content,
					path: 'pages/questionnaire/questionnaire',
					user_id: uni.getStorageSync('member') ? uni.getStorageSync('member').id : 0,
				}
				app.BurialPoint(params)
			},
			chaeckCheckbox(index, indexa, num, type) {
				if (this.question[index].showTextarea) {
					if (type == 1) {
						this.question[index].showTextarea = false
					}
				} else {
					if (type == 1) {
						this.question[index].showTextarea = true
					}
				}
				if (this.question[index].option[indexa].is_check == 1) {
					this.question[index].option[indexa].is_check = 0
					this.question[index].count = this.question[index].count - 1
				} else {
					if (num > 0) {
						if (num > this.question[index].count || num == this.question[index].count) {
							this.question[index].count = this.question[index].count + 1
							this.question[index].option[indexa].is_check = this.question[index].option[indexa].is_check ==
								1 ? 0 : 1
						}
					} else {
						this.question[index].option[indexa].is_check = this.question[index].option[indexa].is_check == 1 ?
							0 : 1
					}
				}
				this.question_index = ''
				var params = {
					event_code: '问卷',
					event_id: this.question[index].id,
					title: this.question[index].title,
					value: this.question[index].option[indexa].content,
					path: 'pages/questionnaire/questionnaire',
					user_id: uni.getStorageSync('member') ? uni.getStorageSync('member').id : 0,
				}
				app.BurialPoint(params)
			},
			chaeckChildRadio(index, indexa, indexo) {
				var option = this.question[index].option
				var opt = this.question[index].option[indexa].opt
				for (var i = 0; i < opt.length; i++) {
					if (i == indexo) {
						this.question[index].option[indexa].opt[i].is_check = this.question[index].option[indexa].opt[i]
							.is_check == 1 ? 0 : 1
						this.question[index].option[indexa].is_check = this.question[index].option[indexa].is_check == 1 ?
							0 : 1
					} else {
						this.question[index].option[indexa].opt[i].is_check = 0
					}
				}
			},
			postSurvey() {
				var question = this.question
				console.log(question)
				var ques = []
				for (var i = 0; i < question.length; i++) {
					var params = {}
					params.q_id = question[i].id
					var optionlist = question[i].option
					var option = []
					if (question[i].is_required == 1) {
						if (question[i].isShow == 1) {
							if (question[i].is_opt == 0) {
								var tmp = optionlist.some(val => {
									return val.is_check == 1;
								})
							} else if (question[i].is_opt == 1) {
								for (var k = 0; k < optionlist.length; k++) {
									if (optionlist[k].is_check == 1) {
										var tmp = true
									} else {
										wx.showToast({
											icon: 'none',
											title: '请选择 ' + question[i].title + ' 的 ' + optionlist[k].content,
										})
										return false;
									}
								}
							}
						} else {
							var tmp = true
						}
					} else {
						var tmp = true
					}
					if (tmp) {
						if (question[i].isShow == 1) {
							if (question[i].type == 1) {
								if (question[i].is_opt == 0) {
									for (var j = 0; j < optionlist.length; j++) {
										if (optionlist[j].is_check == 1) {
											if (question[i].showTextarea && optionlist[j].text == '') {
												wx.showToast({
													icon: 'none',
													title: '请填写' + question[i].title,
												})
												return false
											} else {
												var a = {
													id: optionlist[j].id,
													text: optionlist[j].text,
												}
												option.push(a)
												params.option = option
											}

										}
									}
								} else if (question[i].is_opt == 1) {
									for (var j = 0; j < optionlist.length; j++) {
										var opt = optionlist[j].opt
										for (var k = 0; k < opt.length; k++) {
											if (opt[k].is_check == 1) {
												var a = {
													id: optionlist[j].id,
													text: optionlist[j].text,
													opt_id: opt[k].id
												}
												option.push(a)
												params.option = option
											}
										}

									}
								}
							} else if (question[i].type == 2) {
								for (var j = 0; j < optionlist.length; j++) {
									if (optionlist[j].is_check == 1) {
										if (question[i].showTextarea && optionlist[j].is_show == 1 && optionlist[j].text ==
											'') {
											wx.showToast({
												icon: 'none',
												title: '请填写' + question[i].title,
											})
											return false
										} else {
											var a = {
												id: optionlist[j].id,
												text: optionlist[j].text,
											}
											option.push(a)
											params.option = option
										}
									}
								}
							} else if (question[i].type == 3) {
								for (var j = 0; j < optionlist.length; j++) {
									if (optionlist[j].is_check == 1) {
										if (optionlist[j].text == '') {
											wx.showToast({
												icon: 'none',
												title: '请填写' + question[i].title,
											})
											return false
										} else {
											var a = {
												id: optionlist[j].id,
												text: optionlist[j].text,
											}
											option.push(a)
											params.option = option
										}
									}
								}
							}
						}
					} else {
						if (question[i].type == 3) {
							wx.showToast({
								icon: 'none',
								title: '请填写' + question[i].title,
							})
						} else {
							wx.showToast({
								icon: 'none',
								title: '请选择' + question[i].title,
							})
						}
						return false
					}
					ques.push(params)
				}
				var paramsd = {
					surveyed_id: parseInt(this.id),
					question: ques,
					huodong_join_id: this.huodong_join_id
				}
				console.log(paramsd)
				postSurvey(paramsd).then(res => {
					if (res.state == 1) {
						if (this.info.result_status == 0) {
							if (this.huodong_join_id > 0) {
								uni.redirectTo({
									url: '/pages/group/groupactiveaudit?huodong_id=' + this.huodong_id +
										'&channel=' + this
										.channel + '&huodong_join_id=' + this.huodong_join_id +
										'&is_update=0'
								})
							} else {
								uni.redirectTo({
									url: '/pages/questionnaireok/questionnaireok?scene=' + this.id
								})
							}

						} else {
							this.getSurvey()
						}
					}
				})
				var params = {
					event_code: '提交' + this.info.title ? this.info.title : '问卷',
					event_id: this.id,
					title: this.info.top ? this.info.top : '问卷',
					value: '',
					path: 'pages/questionnaire/questionnaire',
					user_id: uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').user_id : 0,
				}
				app.BurialPoint(params)
			},
			bindTextArea(e) {
				var index = e.target.dataset.index
				var question = this.question
				question[index].option[0].is_check = 1
				question[index].option[0].text = e.detail.value
				this.question = question
				this.question_index = ''
			},
			changeTextarea(index) {
				this.question_index = index
			},
			bindChildTextArea(e) {
				var indexa = e.target.dataset.indexa
				var question = this.question
				question[this.question_index].option[indexa].text = e.detail.value
				this.question = question
			},
			checkBigImg(img) {
				var urlss = this.info.img_url + img
				uni.previewImage({
					current: urlss, // 当前显示图片的http链接
					urls: [urlss] // 需要预览的图片http链接列表
				})
			}
		},
		onShareAppMessage(res) {
			app.getShareTask()
		},
	}
</script>

<style lang="scss">
	.voteq_box {
		overflow-x: hidden;
		background-color: #F7F7F7;

		.top_navbar {
			position: sticky;
			top: 0;
			z-index: 10;
			left: 0;
			right: 0;

			.banner_img {
				width: 100%;
				height: 140rpx;
			}
		}



		.vote_info {
			padding: 30rpx;
			background-color: #FFFFFF;

			.vote_titled {
				font-size: 32rpx;
				color: #3a3a3a;
				font-weight: bold;
				text-align: center;
			}

			.vote_desc {
				font-size: 28rpx;
				color: #383838;
				margin-top: 20rpx;
				text-indent: 52rpx;
			}
		}

		.answer_box {
			padding: 30rpx;
			margin-top: 20rpx;
			background-color: #FFFFFF;

			.answer_cell {
				padding-left: 30rpx;
			}

			.answer_title {
				display: flex;
				align-items: flex-start;
				font-size: 30rpx;
				color: #1A1A1A;
				letter-spacing: 1px;
				font-weight: bold;
			}

			.request_star {
				color: red;
				font-size: 24rpx;
				width: 24rpx;
				margin-top: 8rpx;
			}

			.answer_cell {

				.answer {
					font-size: 28rpx;
					display: inline-block;
					margin-top: 30rpx;
					align-items: center;
					color: #383838;
					letter-spacing: 1px;
					font-weight: 500;
				}

				.radio_img {
					width: 30rpx;
					height: 30rpx;
					margin-right: 30rpx;
					vertical-align: middle;
				}

				.myanswer_title {
					font-size: 28rpx;
					width: 200rpx;
					max-width: 200rpx;
					margin-right: 20rpx;
				}
			}

			.vote_btn {
				width: 260rpx;
				color: #FFFFFF;
				font-size: 28rpx;
				padding: 20rpx 0;
				text-align: center;
				border-radius: 10rpx;
				background-color: #1F2A74;
			}
		}

		.choose_img {
			width: 500rpx;
			height: 300rpx;
			flex: 1;
			vertical-align: middle;
		}

		.choose_img_mini {
			width: 200rpx;
			height: 120rpx;
		}

		.checkImgText {
			font-size: 26rpx;
			text-align: right;
			margin-top: 20rpx;
		}

		.text_input_box {
			margin-left: 60rpx;
			margin-top: 20rpx;
		}

		.progress {
			color: #FFFFFF;
			font-size: 24rpx;
			padding: 10rpx 0;
			background-color: #1F2A74;
			text-align: center;
		}

		.progressd {
			color: #FFFFFF;
			font-size: 24rpx;
			padding: 10rpx 30rpx;
			background-color: #1F2A74;
			margin-top: 20rpx;

		}

		.text_input {
			width: 100%;
			padding: 20rpx;
			background-color: #FFFFFF;
			height: 240rpx;
			background: #FDFFFF;
			border: 1pt solid #C8C8C8;
			font-size: 28rpx;
			border-radius: 4rpx;
		}

	}
</style>